<template>
    <!-- 学生勤工助学页面 -->
    <div class="app-container">
        <div class="tabs">
            <div class="tabs-header">
                <span class="tabs-nav" v-bind:class="{ 'tabs-nav-selected': activeTab === index }"
                    v-for="(tab, index) in tabs" @click="handleTabClick(index)" :key="index">
                    {{ tab }}
                </span>
            </div>
            <div class="tabs-content">
                <div v-show="activeTab == 0">
                    <workforce ref="work"></workforce>
                </div>
                <div v-show="activeTab == 1">
                    <myWork ref="myWorks"></myWork>
                </div>
            </div>
        </div>
       
    </div>
</template>
  
<script>
import workforce from './components/workforce.vue';
import myWork from './components/myWork.vue';
// import history from './components/history.vue';
import { deptTreeSelect } from "@/api/system/user";
import { getSpecialityByDeptId } from "@/api/information/unitMajor";
import {  getStudentDpm } from "@/api/psychological/basic"
export default {
    dicts: [
        "basic_stu_duties" // 学生担任职务字典
    ],
    components: {
        workforce,myWork
    },
    data() {
        return {
            activeName: 'first',
            ruleForm: {
                pageNum: 1,
                pageSize: 10,
            },
            deptOptions: [],
            profession: [],
            showSearch: true,
            tabs: ['勤工助学岗', '我的勤工助学'],
            activeTab: 0,
            form: {
                studentName: undefined,
                dm: undefined

            },
            open: false,
            regCode: '', // 注册号 
            rules:{

            }
        }
    },

    created() {
        this.department()
        this.$nextTick(() => {
            this.handleTabClick(this.activeTab)
        })
    },
    methods: {
        handleClick(tab, event) {
            console.log(tab, event);
        },
        handleChangeName(value) {
      console.log(value,'注册号')
      if (value === '') {
        return false;
      }else {
        getStudentDpm({regCode:value}).then(res => {
          this.form.studentName = res.data.STUDENTNAME
          this.form.dm = res.data.DPM
          this.form.studentId =  res.data.STUDENT_ID
          
        })
      }
    },
        // 获取部门信息
        async department() {
            await deptTreeSelect().then(res => {
                this.deptOptions = res.data;
            });
        },
        // 下拉树选择
        handleChange(value) {
            if (typeof value == "object") {
                this.ruleForm.deptId = value[value.length - 1];
                this.getSpeciality();
            } else if (typeof value == "number") {
                this.ruleForm.deptId = value;
                this.getSpeciality();
            } else if (value == undefined) {
                this.ruleForm.specialityId = "";
            }
        },
        getSpeciality() {
            if (this.ruleForm.deptId) {
                getSpecialityByDeptId({ deptId: this.ruleForm.deptId }).then(res => {
                    if (res.code == "200") {
                        this.profession = res.data;
                    } else {
                        console.log("123");
                        this.profession = [];
                    }
                });
            } else {
                this.profession = [];
            }
        },
        // 添加
        handleAdd() {
            this.open = true
        },
        cancel() {
            this.open = false;
        },
        // tab切换
        handleTabClick(index) {
            this.activeTab = index
            if (index == 0) {
                this.$refs.work.getList(this.ruleForm)
            } else if (index == 1) {
                this.$refs.myWorks.getList(this.ruleForm) 
            }
        },
        handleQuery() {
            this.handleTabClick(this.activeTab)
            console.log(this.ruleForm, '查询')
        },
        resetQuery() {

        },
    }
};
</script>
  
<style lang="scss" scoped>
.tabs-nav-selected {
    color: #3192FC;
    border-bottom: 1px solid #3192FC;
    padding-bottom: 3px;
}

.tabs-header {
    cursor: pointer;
    line-height: 30px;
    height: 30px
}

.tabs-nav {
    line-height: 30px;
    margin-right: 5%;
}
</style>